import React, { Component } from 'react'
import Login from './Login'
import styles from './LoginPage.module.css'
import CenterLayout from '../../CenterLayout'
import { connect } from 'react-redux'
import { Redirect } from 'react-router'

class LoginPage extends Component {
  constructor (props) {
    super(props)
  }

  render () {
    if (this.props.userId !== -1 && this.props.loginType === 'user') return <Redirect to="/home"/>
    else if (this.props.loginType === 'admin' && this.props.admin) return <Redirect to="/admin"/>

    return (
      <CenterLayout>
        <div className={styles.container}>
          <div className={styles.form}>
            <h1 className={styles.center}>登陆</h1>
            <Login/>
          </div>
        </div>
      </CenterLayout>
    )
  }
}

LoginPage.propTypes = {}

LoginPage = connect(
  ({ $UserState: { userId }, $GlobalState: { loginType }, $AdminPageState: { accessToken } }) => ({
    userId,
    loginType,
    admin: !!accessToken
  })
)(LoginPage)

export default LoginPage
